<template>
  <div><h3>当前count值：{{ count }}</h3>
    <button @click="subNumber">减少1</button>
    <button @click="subNumberN">减少N</button>
    <button @click="subAsync">异步减少1</button>
    <button @click="subAsyncN(2)">异步减少N</button>
    <h4>{{ showCount }}</h4>
  </div>
</template>

<script>

import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'

export default {
  name: 'Addition',
  computed: {
    ...mapState(['count']),
    ...mapGetters(['showCount'])
  },
  methods: {
    ...mapMutations(['sub', 'subN']),
    ...mapActions(['subAsync', 'subAsyncN']),
    subNumber: function () {
      this.sub()
    },
    subNumberN: function () {
      this.subN(2)
    }
  }
}
</script>

<style scoped>

</style>
